import { View, Text, StyleSheet, TouchableOpacity } from "react-native";
import translate from "utils/translate";
const List = [
  {
    label: translate("class.P2Model"),
  },
  {
    label: translate("class.P4Model"),
  },
  {
    label: translate("class.P5Model"),
  },
];
export default ({ navigation }: RootStackScreenProps) => {
  return (
    <View
      style={{
        flex: 1,
        alignItems: "center",
      }}
    >
      {List.map((item) => (
        <TouchableOpacity
          key={item.label}
          style={styles.item}
          onPress={() => {
            navigation.navigate("addModel", {
              modelName: item.label.substring(0, 2),
            });
          }}
        >
          <Text style={{ color: "#fff", fontSize: 24 }}>{item.label}</Text>
        </TouchableOpacity>
      ))}
      <Text
        style={{
          marginTop: 20,
          marginBottom: 20,
          color: "#e54d42",
        }}
      >
        {translate("main.tip")}:
      </Text>
      <Text
        style={{
          color: "#e54d42",
        }}
      >
        {translate("class.tipContent")}
      </Text>
      <Text
        style={{
          color: "#e54d42",
          paddingHorizontal:20,
          marginTop:20
        }}
      >
        {translate("home.bind.tip8")}
      </Text>
    </View>
  );
};
const styles = StyleSheet.create({
  item: {
    backgroundColor: "#0081ff",
    marginTop: 20,
    height: 80,
    width: "90%",
    borderRadius: 10,
    justifyContent: "center",
    alignItems: "center",
  },
});
